<!DOCTYPE html>
<html lang="en">
<head>
    <title>Aspect Ratio with Preview Pane | Jcrop Demo</title>
    <meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
    <link rel="stylesheet" href="/css/jcrop_d3.css">
    <link rel="stylesheet" href="/css/jquery.Jcrop.min.css">
    <script src="/js/jquery.min.js"></script>
    <script src="/js/jquery.Jcrop.js"></script>
    <style>
        #preview-pane .preview-container {
            width: 200px;
            height: 200px;
            overflow: hidden;
        }
    </style>
</head>
<body>
</div>
<img src="/avatar/<%=avatar%>" id="target" alt="[Jcrop Example]" />

<div id="preview-pane">
    <div class="preview-container">
        <img src="/avatar/<%=avatar%>" class="jcrop-preview" alt="Preview" />
    </div>
</div>
<!--自己添加的确认剪裁按钮-->
<input type="button" value="剪切" id="cut">
</div>

</body>
<script src="/js/jcrop_d3.js"></script>
</html>

